<script setup>
   import { ref , reactive , onMounted , getCurrentInstance } from "vue";
   import { useStore } from "vuex"; 
   import { useRouter } from "vue-router";
   import { useGetFriendAndGroupApply , useGetNewDynamicCount} from "@/hooks/footer-hook";
   
   const store = useStore();
   const router = useRouter();
   const notifyCount = ref(0);
   const dynamicCount = ref(0);
   const newNotifyCount =  reactive(store.state.notify);
   const user = store.state.user.userInfo;
   const dynamic = store.state.dynamic;
   const app = getCurrentInstance().appContext.app;
   (async () => {
     notifyCount.value = await useGetFriendAndGroupApply(app,store,user._id);
     dynamicCount.value = await useGetNewDynamicCount(store,user._id);
   })(); 

   
</script>
<template>
  <div class="footer">
    <van-tabbar route>
      <van-tabbar-item replace to="/message" icon="chat" :badge="newNotifyCount.notifyCount > 0 ? newNotifyCount.notifyCount : ''"
        >
        消息
        </van-tabbar-item
      >
      <van-tabbar-item replace to="/contacts" icon="manager" :badge="notifyCount > 0 ? notifyCount : ''"
        >联系人</van-tabbar-item
      >
      <van-tabbar-item replace to="/dynamic" icon="star" :badge="dynamic.newDynamicCount > 0 ? dynamic.newDynamicCount : ''"
        >动态</van-tabbar-item
      >
    </van-tabbar>
  </div>
</template>
